import { Button, Result } from 'antd';
import { history } from 'umi';
import {
  ProForm,
  ProFormDatePicker,
  ProFormDateRangePicker,
  ProFormDateTimePicker,
  ProFormDateTimeRangePicker,
  ProFormTimePicker,
} from '@ant-design/pro-components';

// var name = 'Jenny';
// function person() {
//     return this.name;
// }
// console.log(person());  //Jenny
const divEl = document.createElement('div');

export default () => (
  <>
    <Result
      status="404"
      title="404"
      subTitle="Sorry, the page you visited does not exist."
      extra={
        <Button type="primary" onClick={() => history.goBack()}>
          Back Page
        </Button>
      }
    />

    <Button
      onClick={() => {
        const ceeeee = document.getElementById('1');
        ceeeee?.appendChild(document.createTextNode('content'));
      }}
    >
      添加
    </Button>

    <Button
      onClick={() => {
        const ceeeee = document.getElementById('1');
        ceeeee?.removeChild;
      }}
    >
      删除
    </Button>

    <Button onClick={() => {}}>浏览器</Button>

    <div id="1"></div>

    <ProForm
      onFinish={async (values) => {
        console.log(values);
        // console.log(colors);

        return true;
      }}
      initialValues={{ dateRange: ['2022-07-01', '2022-07-03'] }}
    >
      <ProFormDateRangePicker
        name="dateRange"
        label="日期区间"
        rules={[{ required: true, message: 'Please select your country!' }]}
      />
    </ProForm>
  </>
);

// import { Badge, Descriptions, Card } from 'antd';

// const App = () => (
//   <Card>
//     <Descriptions title="User Info" bordered >
//       <Descriptions.Item labelStyle={{ width: 120 }} label="Product">Cloud Database</Descriptions.Item>
//       <Descriptions.Item label="Billing Mode">Prepaid</Descriptions.Item>
//       <Descriptions.Item label="Automatic Renewal">YES</Descriptions.Item>
//       <Descriptions.Item label="Order time">2018-04-24 18:00:00</Descriptions.Item>
//       <Descriptions.Item label="Usage Time" span={2}>
//         2019-04-24 18:00:00
//       </Descriptions.Item>
//       <Descriptions.Item label="Status" span={3}>
//         <Badge status="processing" text="Running" />
//       </Descriptions.Item>
//       <Descriptions.Item label="Negotiated Amount">$80.00</Descriptions.Item>
//       <Descriptions.Item label="Discount">$20.00</Descriptions.Item>
//       <Descriptions.Item label="Official Receipts">$60.00</Descriptions.Item>
//       <Descriptions.Item label="Config Info">
//         Data disk type: MongoDB
//         <br />
//         Database version: 3.4
//         <br />
//         Package: dds.mongo.mid
//         <br />
//         Storage space: 10 GB
//         <br />
//         Replication factor: 3
//         <br />
//         Region: East China 1<br />
//       </Descriptions.Item>
//     </Descriptions>
//   </Card>
// );

// export default App;
